<template>
    <a-modal :visible="visible" :width="1200" @ok="submitForm" @cancel="cancel">
        <a-form-model ref="form" :model="model" :rules="validatorRules">
            <a-row>
                <a-col :span="24">
                    <a-form-model-item label="站点" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="siteId">
                        <j-dict-select-tag v-model="model.siteId" dict-code="HC_SITE,NAME,ID" placeholder="请选择站点"
                            @change="" />
                    </a-form-model-item>
                </a-col>
                <a-col :span="24">
                    <a-form-model-item label="企业名称" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="companyName">
                        <a-input v-model="model.companyName" placeholder="请输入企业名称"></a-input>
                    </a-form-model-item>
                </a-col>
                <a-col :span="24">
                    <a-form-model-item label="企业地址" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="companyAddress">
                        <a-input v-model="model.companyAddress" placeholder="例：南山区科技大厦D栋"></a-input>
                    </a-form-model-item>
                </a-col>
                <a-col :span="24">
                    <a-form-model-item label="企业简称" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="companyShortName">
                        <a-input v-model="model.companyShortName" placeholder="例：F"></a-input>
                    </a-form-model-item>
                </a-col>
                <a-col :span="24">
                    <a-form-model-item label="企业价格" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="companyPrice">
                        <a-input v-model="model.companyPrice" placeholder="请输入企业价格"></a-input>
                    </a-form-model-item>
                </a-col>
                <a-col :span="24">
                    <a-form-model-item label="商户价格" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="merchantPrice">
                        <a-input v-model="model.merchantPrice" placeholder="请输入商户价格"></a-input>
                    </a-form-model-item>
                </a-col>
                <a-col :span="24">
                    <a-form-model-item label="开始订餐时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="startTime">
                        <j-time placeholder="请选择开始时间" v-model="model.startTime" date-format="HH:mm" style="width: 100%" />
                    </a-form-model-item>
                </a-col>
                <a-col :span="24">
                    <a-form-model-item label="结束订餐时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="endTime">
                        <j-time placeholder="请选择结束时间" v-model="model.endTime" date-format="HH:mm" style="width: 100%" />
                    </a-form-model-item>
                </a-col>
                <!-- <a-col :span="24">
                    <a-form-model-item label="是否开启个人订单菜品" :labelCol="labelCol" :wrapperCol="wrapperCol"
                        prop="isOpenPrivateOrder">
                        <a-radio-group v-model="model.isOpenPrivateOrder" button-style="solid">
                            <a-radio-button value="no"> 否 </a-radio-button>
                            <a-radio-button value="yes"> 是 </a-radio-button>
                        </a-radio-group>
                    </a-form-model-item>
                </a-col> -->
                <a-col :span="24">
                    <a-form-model-item label="部门列表" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="companyDepartments">
                        <a-button icon="plus" type="primary" @click="addList('companyDepartments')">添加</a-button>
                        <div v-for="(item, index) in model.companyDepartments" :key="index">
                            <a-input v-model="item.departmentName" placeholder="请输入部门名称" style="width: 90%;"></a-input>
                            <a-button icon="delete" style="margin-left:10px"
                                @click="del('companyDepartments', index)"></a-button>
                        </div>
                    </a-form-model-item>
                </a-col>
                <a-col :span="24">
                    <a-form-model-item label="用户取餐时间选择" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="pickupTime">
                        <a-button icon="plus" type="primary" @click="addList('pickupTime')">添加</a-button>
                        <div v-for="(item, index) in model.pickupTime" :key="index">
                            <j-time placeholder="请选择用户取餐时间" v-model="item.value" date-format="HH:mm" style="width: 90%" />
                            <a-button icon="delete" style="margin-left:10px" @click="del('pickupTime', index)"></a-button>
                        </div>
                    </a-form-model-item>
                </a-col>
                <a-col :span="24">
                    <a-form-model-item label="取餐地址选择" :labelCol="labelCol" :wrapperCol="wrapperCol"
                        prop="companyPickupAddresses">
                        <a-button icon="plus" type="primary" @click="addList('companyPickupAddresses')">添加</a-button>
                        <a-row v-for="(item, index) in model.companyPickupAddresses" :key="index">
                            <a-col :span="14">
                                <a-input v-model="item.pickupAddress" placeholder="请输入取餐地址"></a-input>
                            </a-col>
                            <a-col :span="1"></a-col>
                            <a-col :span="7">
                                <a-input v-model="item.addressCode" placeholder="代号"></a-input>
                            </a-col>
                            <a-col :span="2">
                                <a-button icon="delete" style="margin-left:10px"
                                    @click="del('companyPickupAddresses', index)"></a-button>
                            </a-col>
                        </a-row>
                    </a-form-model-item>
                </a-col>
                <a-col :span="24">
                    <a-form-model-item label="售后赔偿" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="salesCompensationStandards">
                        <a-button icon="plus" type="primary" @click="addList('salesCompensationStandards')">添加</a-button>
                        <div v-for="(item, index) in model.salesCompensationStandards" :key="index">
                            <a-input v-model="item.value" placeholder="请输入赔偿标准" style="width: 90%;"></a-input>
                            <a-button icon="delete" style="margin-left:10px"
                                @click="del('salesCompensationStandards', index)"></a-button>
                        </div>
                    </a-form-model-item>
                </a-col>
                <a-col :span="24">
                    <a-form-model-item label="banner" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="companyBanners">
                        <a-button icon="plus" type="primary" @click="addList('companyBanners')">添加</a-button>
                        <a-row v-for="(item, index) in model.companyBanners" :key="index"
                            style="display: flex;justify-content: flex-start;align-items: center;">
                            <a-col :span="5">
                                <j-image-upload v-model="item.bannerUrl" />
                            </a-col>
                            <a-col :span="19">
                                <a-input v-model="item.bannerPath" placeholder="请填写跳转链接"></a-input>
                            </a-col>
                        </a-row>
                    </a-form-model-item>
                </a-col>
                <a-col :span="24">
                    <a-form-model-item label="创建人" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="createBy">
                        <a-input v-model="model.createBy" placeholder="请输入创建人"></a-input>
                    </a-form-model-item>
                </a-col>
                <a-col :span="24">
                    <a-form-model-item label="钉钉自建应用agentId" :labelCol="labelCol" :wrapperCol="wrapperCol">
                        <a-input v-model="model.dingTalkAgentId" placeholder="请输入agentId"></a-input>
                    </a-form-model-item>
                </a-col>
                <a-col :span="24">
                    <a-form-model-item label="钉钉自建应用clientId" :labelCol="labelCol" :wrapperCol="wrapperCol">
                        <a-input v-model="model.dingTalkAppKey" placeholder="请输入clientId"></a-input>
                    </a-form-model-item>
                </a-col>
                <a-col :span="24">
                    <a-form-model-item label="钉钉自建应用clientSecret" :labelCol="labelCol" :wrapperCol="wrapperCol">
                        <a-input v-model="model.dingTalkAppSecret" placeholder="请输入clientSecret"></a-input>
                    </a-form-model-item>
                </a-col>
            </a-row>
        </a-form-model>
    </a-modal>
</template>

<script>
import { postAction } from '../../../../api/manage';

export default {
    name: 'AntDesignVueJeecgCreate',

    data() {
        let checkcompanyDepartments = (rule, value, callback) => {
            console.log('!!!!!!this.model.companyDepartments', this.model.companyDepartments)
            if (this.model.companyDepartments.length == 0) {
                console.log('!!!!!!')
                callback(new Error('请填写至少一个部门名称'));
            } else {
                if (!this.model.companyDepartments[0].value) {
                    callback(new Error('请填写至少一个部门名称'));
                } else {
                    callback();
                }
            }
        }
        let checkpickupTime = (rule, value, callback) => {
            if (this.model.pickupTime.length == 0) {
                console.log('666666')
                callback(new Error('请填写至少一个用户取餐时间'));
            } else {
                if (!this.model.pickupTime[0].value) {
                    console.log('88888')
                    callback(new Error('请填写至少一个用户取餐时间'));
                } else {
                    console.log('9999')
                    callback();
                }
            }
        }
        let checkcompanyPickupAddresses = (rule, value, callback) => {
            if (this.model.companyPickupAddresses.length == 0) {
                callback(new Error('请填写至少一个用户取餐地址'));
            } else {
                if (!this.model.companyPickupAddresses[0].pickupAddress) {
                    callback(new Error('请填写至少一个用户取餐地址'));
                } else {
                    callback();
                }
            }
        }
        let checksalesCompensationStandards = (rule, value, callback) => {
            if (this.model.salesCompensationStandards.length == 0) {
                callback(new Error('请填写填写一个售后标准'));
            } else {
                if (!this.model.salesCompensationStandards[0].value) {
                    callback(new Error('请填写填写一个售后标准'));
                } else {
                    callback();
                }
            }
        }
        return {
            visible: false,
            model: {
                companyDepartments: [],
                pickupTime: [],
                companyPickupAddresses: [],
                salesCompensationStandards: [],
                companyBanners: [],
            },
            labelCol: {
                xs: { span: 24 },
                sm: { span: 5 },
            },
            wrapperCol: {
                xs: { span: 24 },
                sm: { span: 16 },
            },
            validatorRules: {
                siteId: [{ required: true, message: '请选择站点!' }],
                companyName: [{ required: true, message: '请输入企业名称!' }],
                companyAddress: [{ required: true, message: '请输入企业地址!' }],
                companyShortName: [{ required: true, message: '请输入企业简称!' }],
                companyPrice: [{ required: true, message: '请输入企业价格!' }],
                merchantPrice: [{ required: true, message: '请输入商户价格!' }],
                startTime: [{ required: true, message: '请选择开始订餐时间!' }],
                endTime: [{ required: true, message: '请选择结束订餐时间!' }],
                isOpenPrivateOrder: [{ required: true, message: '请选择是否开启部门选择!' }],
                isOpenPrivateOrder: [{ required: true, message: '请选择是否开启开启个人订单菜品!' }],
                // companyDepartments: [{ required: true, validator: checkcompanyDepartments, trigger: 'change' }],
                pickupTime: [{ required: true, validator: checkpickupTime, trigger: 'change' }],
                companyPickupAddresses: [{ required: true, validator: checkcompanyPickupAddresses, trigger: 'change' }],
                salesCompensationStandards: [{ required: true, validator: checksalesCompensationStandards, trigger: 'change' }],
                createBy: [{ required: true, message: '请填写创建人!' }]
            },
            type: '',
        };
    },

    mounted() {

    },

    methods: {
        show(type, record) {
            this.type = type;
            if (type == 'edit') {
                this.model = JSON.parse(JSON.stringify(record));
                console.log('!!!!!!!!!', record.salesCompensationStandards.split(',').map(item => item = { value: item }))
                this.model.salesCompensationStandards = record.salesCompensationStandards.split(',').map(item => item = { value: item });
                this.model.pickupTime = record.pickupTime.split(',').map(item => item = { value: item });
                console.log('this.model', this.model);
            }
            this.visible = true;
        },
        cancel() {
            this.visible = false;
            this.model = {
                companyDepartments: [],
                pickupTime: [],
                companyPickupAddresses: [],
                salesCompensationStandards: [],
                companyBanners: []
            }
        },
        addList(listName) {
            let flag = false;
            let value;
            switch (listName) {
                case 'companyPickupAddresses':
                    value = 'pickupAddress';
                    break
                case 'companyBanners':
                    value = 'bannerUrl';
                    break
                case 'companyDepartments':
                    value = 'departmentName';
                    break
                case 'pickupTime':
                    value = 'value';
                    break
                case 'salesCompensationStandards':
                    value = 'value';
                    break
            }
            for (let i = 0; i < this.model[listName].length; i++) {
                if (!this.model[listName][i][value]) {
                    flag = true;
                    break;
                }
            }
            if (flag) {
                this.$message.warning('请先填写上一个内容');
            } else {
                let obj = '';
                if (listName == 'companyPickupAddresses') {
                    obj = { pickupAddress: '', addressCode: '' }
                } else if (listName == 'companyBanners') {
                    obj = { bannerUrl: '', bannerPath: '' }
                } else if (listName == 'companyDepartments') {
                    obj = { departmentName: '' }
                } else {
                    obj = { value: '' }
                }
                this.model[listName].push(obj);
            }
        },
        del(listName, index) {
            this.model[listName].splice(index, 1);
        },
        submitForm() {
            this.$refs.form.validate(async valid => {
                if (valid) {
                    let params = JSON.parse(JSON.stringify(this.model));
                    let tempPickupTime = [], tempSalesCompensationStandards = [];
                    params.pickupTime.forEach((item, index) => {
                        tempPickupTime.push(item.value)
                    })
                    params.salesCompensationStandards.forEach((item, index) => {
                        tempSalesCompensationStandards.push(item.value)
                    })
                    params.pickupTime = tempPickupTime.join(',');
                    params.salesCompensationStandards = tempSalesCompensationStandards.join(',')
                    console.log('params', params);
                    console.log('edit', this.type);
                    let res;
                    if (this.type == 'edit') {
                        res = await postAction('hc/hcCompanyInfo/edit', params);
                    } else {
                        res = await postAction('hc/hcCompanyInfo/add', params);
                    }
                    console.log('res', res);
                    if (res.success) {
                        this.$message.success(`企业${this.type == 'edit' ? '编辑' : "新建"}成功`);
                        this.cancel();
                        this.$emit('loadData');
                    } else {
                        this.$message.warning(res.message);
                    }
                }
            })
        },
    },
};
</script>

<style lang="scss" scoped></style>